﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="detail.aspx.cs" Inherits="HungryCrowd.detail" MasterPageFile="~/master/Main.Master" %>
<asp:Content ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

    <div class="formLayout" style="height:600px">
<%--        <div style="height:170px;">
            <div style="margin-bottom:8px;text-align:center;"><h3>Find a Trader near you...</h3></div>
            <div style="float:left;width:120px;margin:5px;">Location:</div><div style="margin:5px;float:left;width:200px;"><asp:DropDownList ID="ddlLocation" runat="server" ClientIDMode="Static" Width="120"></asp:DropDownList></div>
            <div id="marketsDiv" style="display:none;"><div style="float:left;width:120px;margin:5px;">Markets:</div><div style="margin:5px;float:left;width:200px;"><asp:DropDownList ID="ddlMarkets" runat="server" ClientIDMode="Static" Width="120"></asp:DropDownList> </div></div>
            <div id="vendorDiv" style="display:none;"><div style="float:left;width:120px;margin:5px;">Vendors:</div><div style="margin:5px;float:left;width:200px;"><asp:DropDownList ID="ddlTraders" runat="server" ClientIDMode="Static" Width="120"></asp:DropDownList> </div></div>
        </div>        
    </div>--%>
    <div id="traderWrapper" style="display:none;width:500px;height:428px;padding:5px;margin-left:auto;margin-right:auto;left:15px;position:relative;border:1px solid #fff;text-align:justify">
        <div style="width:400px;height:290px;float:left;" id="traderDetails"><div></div></div>
    </div>
    <div id="twitterDiv" style="width:550px;height:120px;float:left;padding-top:26px;">            
        <a class="twitter-timeline" href="https://twitter.com/Hungry_Crowd" data-widget-id="379713247147864064" data-tweet-limit="2">Tweets by @Hungry_Crowd</a>
        <script>!function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0], p = /^http:/.test(d.location) ? 'http' : 'https'; if (!d.getElementById(id)) { js = d.createElement(s); js.id = id; js.src = p + "://platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs); } }(document, "script", "twitter-wjs");</script>
    </div>
    </div>
    <script type="text/javascript">
        $(document).ready(function () {
            debugger;
            var getQueryStrings = window.location.href.split('?')[1].split('&');
            var traderId = 1; //getQueryStrings[0].split('=')[1];
            var dataToSend = { TraderId: traderId, MethodName: 'GetTrader' };
            var options = {
                url: '/server/ajax.aspx',
                data: dataToSend,
                dataType: 'JSON',
                type: 'POST',
                success: function (response, status, XHR) {
                    if (status != 'success') {
                        alert('Error occurred.' + XHR);
                    }
                    else {
                        debugger;
                        var traders = JSON.parse(response);

                        if (traders.Id > 0) {
                            $('#traderDetails div:last').after(
                            $('<div style="width:120px;float:left;margin:5px;"></div>').text("Name:"),
                            $('<div style="float:left;width:200px;margin:5px;"></div>').text(traders.Name),
                            $('<div style="width:120px;float:left;margin:5px;"></div>').text("Contact:"),
                            $('<div style="float:left;width:200px;margin:5px;"></div>').text(traders.ContactPerson),
                            $('<div style="width:120px;float:left;margin:5px;"></div>').text("Profile Pic:"),
                            $('<div style="float:left;width:200px;margin:5px;"></div>').prepend("<img id='pic' alt='' src="+ traders.ImageUrl +" width='100' height='100' />"),
                            $('<div style="width:120px;float:left;margin:5px;"></div>').text("Description"),
                            $('<div style="float:left;width:489px;text-align:justify;margin: 5px;line-height: 1.1em;"></div>').text(traders.Description),
                            $('<div style="width:120px;float:left;margin:5px;"></div>').text('Trading Days:'),
                            $('<div style="float:left;width:200px;margin:5px;"></div>').text(traders.TradingDays),
                            $('<div style="width:120px;float:left;margin:5px;"></div>').text('Trading Area:'),
                            $('<div style="float:left;width:200px;margin:5px;"></div>').text(traders.TradingArea),
                            $('<div style="width:120px;float:left;margin:5px;"></div>').text('Email:'),
                            $('<div style="float:left;width:200px;margin:5px;"></div>').text(traders.EmailAddress)
                            );
                        }
                        $('#traderWrapper').show();
                    }
                }

            };
            $.ajax(options);
            //} else {
            //    $('#name').text('');
            //    $('#description').text('');
            //    $('#tradingDays').text('');
            //    $('#tradingArea').text('');
            //    $('#contact').text('');
            //    $('#email').text('');
            //    $('#traderWrapper').hide();
        });
    </script>
</asp:Content>